<form id="add-form" class="form-horizontal" role="form" data-toggle="validator" method="POST" action="">
    <div class="form-group">
        <label for="c-deviceid" class="control-label col-xs-12 col-sm-2">设备名称(ID)</label>
        <div class="col-xs-12 col-sm-8">
            <select id="c-deviceid" name="row[deviceid]" class="form-control" form="add-form">
                {$datalist}
            </select>
            <script>
                document.getElementById("c-deviceid").value="{$deviceout}";
            </script>
        </div>
    </div>
    <div class="form-group">
        <label for="c-name" class="control-label col-xs-12 col-sm-2">{:__('Name')}:</label>
        <div class="col-xs-12 col-sm-8">
            <input id="c-name" data-rule="required" class="form-control" name="row[name]" type="text">
        </div>
    </div>
    <div class="form-group">
        <label for="c-alias" class="control-label col-xs-12 col-sm-2">别名</label>
        <div class="col-xs-12 col-sm-8">
            <input id="c-alias" data-rule="required" class="form-control" name="row[alias]" type="text" onkeyup="value=value.replace(/[\W]/g,'') " onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^\d]/g,''))">
        </div>
    </div>
    <div class="form-group">
        <label for="c-datatype" class="control-label col-xs-12 col-sm-2">{:__('Datatype')}:</label>
        <div class="col-xs-12 col-sm-8">
            <select id="c-datatype" class="form-control" name="row[datatype]" onchange="onSelected(this.options[this.options.selectedIndex].value)">
                <option value="0">数值型</option>
                <option value="1">文本型</option>
                <option value="2">gps型</option>
                <option value="3">图片型</option>
                <option value="4">开关型</option>
                <option value="5">自定义</option>
            </select>
        </div>
    </div>
    <div id="showtype" class="form-group">
        <label for="c-unit" class="control-label col-xs-12 col-sm-2">详细设置</label>
        <div class="col-xs-12 col-sm-8">
            单位:
           <input id="c-unit" class="form-control" name="show[unit]" type="text" style="width: 100px">
            符号:
            <input id="c-symbol" class="form-control" name="show[symbol]" type="text" style="width: 80px">

            <select tabindex="1" id="symbol_s" onchange="setSymbol(this.value)" style="height: 30px">
                <option value="0">常用符号</option>
                <option value="°C">°C</option>
                <option value="℉">℉</option>
                <option value="Ω">Ω</option>
                <option value="㎡">㎡</option>
                <option value="Pa">Pa</option>
                <option value="Kg">Kg</option>
            </select>
        </div>
    </div>
    <div class="form-group">
        <label for="c-description" class="control-label col-xs-12 col-sm-2">{:__('Description')}:</label>
        <div class="col-xs-12 col-sm-8">
            <textarea id="c-description" class="form-control " rows="5" name="row[description]" cols="50"></textarea>
        </div>
    </div>
    <div class="form-group">
        <label for="c-hooklist" class="control-label col-xs-12 col-sm-2">WebHook:</label>
        <div class="col-xs-12 col-sm-8" id="c-hooklist">
            <dl class="fieldlist" rel="1">
                <dd>
                    <div></div>
                    <input type="text" name="hook[0]" class="form-control" id="value-0" value="" size="40" required/>
                    <span class="btn btn-sm btn-danger btn-remove"><i class="fa fa-times"></i></span>
                    <span class="btn btn-sm btn-primary btn-dragsort"><i class="fa fa-arrows"></i></span>
                </dd>
                <dd><a href="javascript:;" class="append btn btn-sm btn-success"><i class="fa fa-plus"></i> 追加</a></dd>
            </dl>
        </div>
    </div>
    <div class="form-group layer-footer">
        <label class="control-label col-xs-12 col-sm-2"></label>
        <div class="col-xs-12 col-sm-8">
            <button type="submit" class="btn btn-success btn-embossed disabled">{:__('OK')}</button>
            <button type="reset" class="btn btn-default btn-embossed">{:__('Reset')}</button>
        </div>
    </div>
</form>
<script>
    function onSelected(v){
        switch (v){
            case "0": $("#showtype").show();break;
            default: $("#showtype").hide();break;
        }
    }
    function setSymbol(symbolVal){
        if(symbolVal != "0"){
            $("#c-symbol").val(symbolVal);
        }
    }
</script>
